<template>
  <div>
    <div v-if="mode === 'DESIGN'">内联框架，显示URL页面</div>
    <div v-else>
      <iframe scrolling="auto" frameborder="0" :src="parsingUrl" :height="height + 'px'" width="100%"></iframe>
    </div>
  </div>
</template>

<script>
import componentMinxins from '/@/views/setting/workflow/components/ComponentMinxins'
import { Field } from 'vant'
import ScanCode from '/@/views/setting/workflow/common/ScanCode.vue'
import { computed, reactive, toRefs } from 'vue'

export default {
    name: 'WebIframe',
    mixins: [componentMinxins],
    components: { Field, ScanCode },
    props: {
        modelValue: {
            type: String,
            default: null,
        },
        placeholder: {
            type: String,
            default: '请输入内容',
        },
        url: {
            type: String,
            default: '',
        },
        height: {
            type: Number,
            default: 200,
        },
    },
    emits: ['update:modelValue'],
    setup(props) {
        const { url } = toRefs(props)
        const state = reactive({
            visible: false,
        })
        const parsingUrl = computed(() => {
             //上下文变量 不存在
            // const context = this.$store.state.context || {}
            //为了支持变量替换、可能导致安全问题
            return eval('`' + url.value + '`')
        })
        return {
            ...toRefs(state),
            parsingUrl
        }
    }
}
</script>

<style>

</style>